<template>
	<div>
		<div class="flex">
			<div class="yuan" style="text-align: center;">
				<div class="num">1</div>
				<div class="word">申请信息</div>
			</div>
			<div style="border: 2px solid #f2f2f2; width: 50px;margin-bottom: 20px;"></div>
			<div style="text-align: center;">
				<div class="num1">2</div>
				<div class="word1">证件上传</div>
			</div>
			<div style="border: 2px solid #f2f2f2; width: 50px; margin-bottom: 20px;"></div>
			<div>
				<div class="num1">3</div>
				<div class="word1">病例信息</div>
			</div>
		</div>
		<div class="text">
			病例信息
		</div>
		<div class="choose">
			<div class="state">出院状态选择</div>
			<div class="discharge ">
				<span class="list">已出院</span>
				<span class="list1">未出院</span>
			</div>
		</div>
		<div class="choose">
			<div class="state">领取方式</div>
			<div class="discharge ">
				<span class="list" style="padding:4px 20px;">邮寄</span>
				<span class="list1" style="padding:4px 20px;">自取</span>
			</div>
		</div>
		<div class="text">
			收件信息
		</div>
		<div class="message">
			<div>姓名</div>
			<div class="name" style="margin-left: 88px;">请输入真实姓名</div>
		</div>
		<div class="message">
			<div>手机号码</div>
			<div class="name" style="color: #000">1908880760</div>
		</div>
		<div class="message">
			<div>选择城市</div>
			<div class="name">请选择城市</div>
			<div class="right">></div>
		</div>
		<div class="message" style="padding-bottom: 50px;">
			<div>详细地址</div>
			<div class="name">请填写详细地址</div>
		</div>
		<div class="next" @click="upload">下一步</div>
		<div style="height: 80rpx;"></div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
	
			}
		},
		methods: {
			upload() {
				uni.navigateTo({
					url: "../../../hospitalizationServices/pages/send/upload"
				})
			}
	
		}
	}
</script>

<style>
	.next{
			background:  #006eff;
			border-radius: 8rpx;
			padding: 14rpx 0;
			text-align: center;
			color: #ffffff;
			font-size: 30rpx;
			margin: 50rpx 20rpx;
		}
	.right {
	  margin-left: 140px;
	  color: #aaaaaa;
	  font-size: 15px;
	}

	.name {
		color: #aaaaaa;
		font-size: 15px;
		margin-left: 60px;
	}

	.message {
		display: flex;
		color: #000;
		font-size: 15px;
		margin: 20px 10px 0 20rpx;
		border-bottom: 1px solid #f2f2f2;
		padding-bottom: 15px;

	}

	.list1 {
		background: #e4f0ff;
		color: #000;
		border-radius: 50px;
		padding: 4px 10px;
		font-size: 15px;
		text-align: center;
		margin-left: 20px;
	}

	.list {
		background: #006eff;
		color: #FFF;
		border-radius: 50px;
		padding: 4px 10px;
		font-size: 15px;
		text-align: center;
	}

	.discharge {
		margin-top: 15px;
	}

	.state {
		font-size: 16px;
	}

	.choose {
		margin: 15px 10px;
		border-bottom: 1px solid #f2f2f2;
		padding-bottom: 15px;
	}

	.text {
		color: #aaaaaa;
		font-size: 15px;
		margin: 20px 10px 0 20rpx;
		border-bottom: 1px solid #f2f2f2;
		padding-bottom: 15px;

	}

	.flex {
		margin-top: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
	}

	.yuan {
		text-align: center;
	}

	.num {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		border: 1px solid;
		background: #006eff;
		color: #FFF;
		text-align: center;
		line-height: 30px;
		margin-left: 12px;
		font-size: 14px;
	}

	.num1 {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		border: 1px solid;
		background: #FFF;
		color: #aaaaaa;
		text-align: center;
		line-height: 30px;
		margin-left: 12px;
	}

	.word {
		font-size: 14px;
		margin-top: 8px;
		color: blue;
	}

	.word1 {
		font-size: 14px;
		margin-top: 8px;
		color: #aaaaaa;
	}
</style>